<template>
  <div class="page shenhe">
    <el-card class="box-card">
       <el-form :model="form" label-width="80px">
           <el-col :span='4'>
               <el-form-item label="申报单位">
                <el-input size="mini" v-model="form.schoolName"></el-input>
              </el-form-item>
           </el-col>
           <el-col :span='4'>
               <el-form-item label="所在区">
                <el-input size="mini" v-model="form.address"></el-input>
              </el-form-item>
           </el-col>
           <el-col :span='4'>
               <el-form-item label="姓名">
                <el-input size="mini" v-model="form.studentName"></el-input>
              </el-form-item>
           </el-col>
           <el-col :span='4'>
               <el-form-item label="申报状态">
               <el-select  size="mini" v-model="form.review" placeholder="请选择">
                    <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value">
                    </el-option>
                </el-select>
              </el-form-item>
           </el-col>
           <el-col :span='4' style="margin:0 10px 10px 20px;">
               <el-button @click="search" type="primary" size="mini">搜索</el-button>
               <!-- <el-button type="primary" size="mini">导出</el-button> -->
           </el-col>
       </el-form>
      <el-table
          :data="tableData"
          border
          stripe
          style="width: 100%">
          <el-table-column
            prop="project_title"
            label="项目名称"
            >
          </el-table-column>
          <el-table-column
            prop="school_name"
            label="申报单位"
            >
          </el-table-column>
          <el-table-column
            prop="school_address"
            label="所在区"
            >
          </el-table-column>
          <el-table-column
            prop="student_name"
            label="姓名"
            >
          </el-table-column>
          <el-table-column
            prop="review"
            label="申报状态"
            >
          </el-table-column>
          <el-table-column
            prop="score"
            label="审核信息">
            <template slot-scope="scope">
                <el-button
                @click='addid(scope)'
                type="text"
                size="small">
                审核此项目
                </el-button>
            </template>
          </el-table-column>
        </el-table>

        <!-- 分页 -->
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page.sync="currentPage1"
          :page-size="10"
          layout="total, prev, pager, next"
          :total="total">
        </el-pagination>
    </el-card>
    <el-dialog
        top='2vh'
        :lock-scroll='true'
        title="项目预览"
        :visible.sync="dialogVisible"
        width="1200px"
        >
        <div>
          <small>提示：如果无法查看PDF，请确认是否被浏览器拦截。</small>
        </div>
        <div v-for="(i,index) in item" :key="index">

            <h3>{{i.name}}</h3>
            <el-button type="text" @click="booklook(i.number)">预览PDF</el-button>
            
        </div>

        <el-dialog
        width="30%"
        title="填写理由"
        :visible.sync="innerVisible"
        append-to-body>
          <el-input type="textarea"
            v-model="notPass"
             :autosize="{ minRows: 5, maxRows: 5}"
          ></el-input>
          <div slot="footer" class="dialog-footer">
            <el-button size="mini" @click="innerVisible = false">取消</el-button>
            <el-button size="mini" type="primary" @click="pass(3,notPass)">确定</el-button>
          </div>
        </el-dialog>
        
        <div slot="footer" class="dialog-footer">
            <el-button size="mini" @click="pass(2,null)">审核通过</el-button>
            <el-button size="mini" type="primary" @click="innerVisible = true">审核不通过</el-button>
        </div>
    </el-dialog>
     <!-- <iframe id="google_ads_frame2" name="google_ads_frame2" width="100%" height="100%" class="iframebox" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" allowfullscreen="true"  :src="testpdfurl" frameborder="0"></iframe> -->
    <c-pdf @closepdf="closepdf" :show='isshowpdf' v-show="isshowpdf" :pdfurl="testpdfurl"></c-pdf>
  </div>
</template>

<script type="text/ecmascript-6">
import CPdf from "./CPdf";
export default {
  data() {
    return {
      notPass: null,
      item: [
        {
          name: "作者信息",
          number: 1
        },
        {
          name: "研究项目",
          number: 2
        },
        {
          name: "个人陈述",
          number: 3
        },
        {
          name: "辅导教师",
          number: 4
        },
        {
          name: "学习成绩",
          number: 5
        },
        {
          name: "指导专家",
          number: 6
        }
      ],
      testpdfurl: "",
      api: process.env.API_ROOT,
      isshowpdf: false,
      total: null,
      currentPage1: 1,
      id: null,
      dialogVisible: false,
      innerVisible: false,
      tableData: [
        {
          date: "科研项目",
          name: "浙江省杨贤江高中",
          address: "进入测评｜同步分数",
          sex: "宁波慈溪",
          score: "审核此项目",
          phone: "审核通过",
          grade: "张晓"
        }
      ],
      page: 1,
      form: {
        schoolName: "",
        address: "",
        studentName: "",
        review: ""
      },
      options: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 1,
          label: "未审核"
        },
        {
          value: 2,
          label: "审核通过"
        },
        {
          value: 3,
          label: "审核不通过"
        }
      ],
      value: "",
      book1: null,
      book2: null,
      book3: null,
      book4: null,
      book5: null,
      book6: null
    };
  },
  components: {
    CPdf
  },
  methods: {
    closepdf() {
      this.isshowpdf = false;
    },
    handleSizeChange(val) {
      this.page = val;
      this.getdata(this.form, val);
    },
    handleCurrentChange(val) {
      this.page = val;
      this.getdata(this.form, val);
    },
    search() {
      this.getdata(this.form, this.page);
    },
    getdata(data, page) {
      // let { schoolName, address, studentName, review } = data;
      let datas = {
        params: data
      };
      this.$http.get(`/filing/sheet/list/${page}`, datas).then(res => {
        this.total = res.data.total;
        let data = res.data.data.map(item => {
          switch (item.review) {
            case 1:
              item.review = "未审核";
              break;
            case 2:
              item.review = "审核通过";
              break;
            case 3:
              item.review = "审核不通过";
              break;

            default:
              break;
          }
          return item;
        });
        this.tableData = data;
      });
    },
    show() {
      this.show = ture;
    },
    booklook(val) {
      switch (val) {
        case 1:
          if (this.book1 === null) {
            this.$message.error("暂无内容");
            return;
          }

          // this.testpdfurl = this.api + this.book1;
          this.testpdfurl = this.api + '/pdf' + this.book1;
          // this.testpdfurl = this.api + '/image/20180417/479cfe49-7075-4b0b-b94a-619f774b43f9.pdf';
          // this.$http.get(`${this.testpdfurl}`).then(res => {
          //   console.log(res)
          // })
          window.open(this.testpdfurl)
          break;
        case 2:
          if (this.book2 === null) {
            this.$message.error("暂无内容");
            return;
          }
          // this.testpdfurl = this.api + this.book2;
          this.testpdfurl = this.api + '/pdf' + this.book2;
          // this.$http.get(`${this.testpdfurl}`).then(res => {
          //   console.log(res)
          // })
          window.open(this.testpdfurl)
          break;
        case 3:
          if (this.book3 === null) {
            this.$message.error("暂无内容");
            return;
          }
          
          this.testpdfurl = this.api + '/pdf' + this.book3;
          // this.$http.get(`${this.testpdfurl}`).then(res => {
          //   console.log(res)
          // })
          window.open(this.testpdfurl)
          // window.open(this.api + this.book3)
          // this.testpdfurl = this.api + this.book3;
          break;
        case 4:
          if (this.book4 === null) {
            this.$message.error("暂无内容");
            return;
          }
          this.testpdfurl = this.api + '/pdf' + this.book4;
          // this.$http.get(`${this.testpdfurl}`).then(res => {
          //   console.log(res)
          // })
          window.open(this.testpdfurl)
          // window.open(this.api + this.book4)
          this.testpdfurl = this.api + this.book4;
          break;
        case 5:
          if (this.book5 === null) {
            this.$message.error("暂无内容");
            return;
          }
          this.testpdfurl = this.api + '/pdf' + this.book5;
          // window.open(this.api + this.book5)
          // this.$http.get(`${this.testpdfurl}`).then(res => {
          //   console.log(res)
          // })
          window.open(this.testpdfurl)
          // this.testpdfurl = this.api + this.book5;
          break;
        case 6:
          if (this.book6 === null) {
            this.$message.error("暂无内容");
            return;
          }
          this.testpdfurl = this.api + '/pdf' + this.book6;
          // window.open(this.api + this.book6)
          window.open(this.testpdfurl)
          // this.$http.get(`${this.testpdfurl}`).then(res => {
          //   console.log(res)
          // })
          // this.testpdfurl = this.api + this.book6;
          break;
        default:
          break;
      }
      // this.isshowpdf = true;
    },
    addid(val) {
      this.id = val.row.id;
      let id = val.row.user_id;
      this.dialogVisible = true;
      this.$http
        .get("/filing/book/find/userId", {
          params: {
            userId: id
          }
        })
        .then(res => {
          this.book1 = res.data.data.book1;
          this.book2 = res.data.data.book2;
          this.book3 = res.data.data.book3;
          this.book4 = res.data.data.book4;
          this.book5 = res.data.data.book5;
          this.book6 = res.data.data.book6;
        });
    },
    pass(val, reason) {
      let id = this.id;
      let data = {
        review: val,
        reason: reason
      };
      if (val === 3) {
        if (this.notPass === null) {
          this.$message.error("请填写理由！");
          return false;
        }
      }
      this.$http.put(`/filing/sheet/${id}`, data).then(res => {
        this.getdata(this.form, this.page);
        this.innerVisible = false;
        this.notPass = null
        switch (res.data.success) {
          case true:
            this.$message({
              message: res.data.message,
              type: "success"
            });
            this.dialogVisible = false;
            break;
          case false:
            this.$message({
              message: res.data.message,
              type: "error"
            });
            this.dialogVisible = false;
            break;

          default:
            break;
        }
      });
    }
  },
  mounted() {
    this.getdata(this.form, this.page);
  }
};
</script>

<style scoped lang="scss">
@import "./index.scss";
</style>
